<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <input type="file" id="file-input">
  <div class="container"></div>
  <script>
    const fileInput=document.getElementById('file-input')
    fileInput.onchange=(e)=>{
     const file=e.target.files[0]
     const reader=new FileReader()
     reader.onload=()=>{
      const base64String=reader.result.split(',')[1]
      const base64Data='data:image/jpeg;base64,'+base64String
      const img=new Image(200,200)
      img.src=base64Data
      document.querySelector('.container').appendChild(img)
     }
     reader.readAsDataURL(file)
    }
  </script>
</body>
</html>